<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"  lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" th:src="@{/static/js/jquery-1.9.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/layui-v2.6.13/layui/layui.js}"></script>
    <link rel="stylesheet" type="text/css" th:href="@{/static/layui-v2.6.13/layui/css/layui.css}"/>
    <title>Title</title>
</head>
<body>
<div class="layui-card">
    <div class="layui-card-header" align="center">订单列表</div>
    <div class="layui-card-body">
        <div >
            <button type="button" onclick="refAllChecked()" class="layui-btn layui-btn-primary">一键退款</button>
            <button type="button" onclick="expressAllChecked()" class="layui-btn layui-btn-primary">一键发货</button>
        </div>
        <table class="layui-table">
            <tr>
                <th><input type="checkbox" onclick="checkAll(this)"></th>
                <th>订单号</th>
                <th>用户id</th>
                <th>交易金额</th>
                <th>交易时间</th>
                <th>订单状态</th>
                <th>订单详情</th>
            </tr>
            <tr th:each="dd:${pageinfo.list}">
                <td><input type="checkbox" th:value="${dd.orderId}" name="xun"></td>
                <td th:text="${dd.orderId}" > </td>
                <span th:each="user:${users}">
                    <td th:if="${user.id == dd.userId}">[[${user.phone}]]</td>
                </span>
                <td th:text="${dd.orderMoney}" > </td>
                <td th:text="${dd.createTime}" > </td>
                <td th:switch="${dd.orderStatus}">
                    <span th:case="1">待付款</span>
                    <span th:case="2">待发货</span>
                    <span th:case="3">已发货</span>
                    <span th:case="4">已签收</span>
                    <span th:case="5">退款中</span>
                </td>
                <td><button type="button" th:onclick="detail([[${dd.orderId}]])" class="layui-btn layui-btn-sm layui-btn-primary">查看</button></td>
            </tr>
        </table >
        <div align="center">
            <button type="button" th:onclick="page(1)" class="layui-btn layui-btn-primary">首页</button>
            <button type="button" th:onclick="page([[${pageinfo.pageNum}-1]])" class="layui-btn layui-btn-primary">上一页</button>
            <span th:text="${pageinfo.pageNum}"></span>
            <span>/</span>
            <span th:text="${pageinfo.pages}"></span>
            <button type="button" th:onclick="page([[${pageinfo.pageNum}+1]])" class="layui-btn layui-btn-primary">下一页</button>
            <button type="button" th:onclick="page([[${pageinfo.pages}]])" class="layui-btn layui-btn-primary">尾页</button>
        </div>
    </div>
</div>

</body>
<script>
    function page(p){
        location.href = "ok?pageNum="+p;
    }
    function openLayer(id){
        layer.open({
          type: 2,
          area: ['650px', '500px'],
          content: 'toOrder?orderId='+id,
          end: function(){
              location.reload();
          }
        });
    }
    function detail(id){
        location.href='detail?orderId='+id;
    }
    function checkAll(obj){
      var a = $(obj).prop("checked");
      if(a){
          $(":checkbox[name='xun']").prop("checked",true);
      } else {
          $(":checkbox[name='xun']").prop("checked",false);
      }
    }
    function refAllChecked(){
      var es = $(":checkbox[name='xun']:checked");
      var params = "";
      $.each(es,function(index,item){
            console.info(item.value);
            params += item.value + ",";
      })
      window.location.href="refund?ids="+params.substr(0,params.length-1);
    }
    function expressAllChecked(){
      var es = $(":checkbox[name='xun']:checked");
      var params = "";
      $.each(es,function(index,item){
            console.info(item.value);
            params += item.value + ",";
      })
      window.location.href="express?ids="+params.substr(0,params.length-1);
    }
</script>
</html>